import CommonModal from '@/components/CommonModal';
import CommonLoading from '@/components/CommonLoading';
import { useState, useEffect } from 'react';
import { Form, Input, message } from 'antd';
import { CommonForm } from '@/pages/OrderModule/common/components/CommonForm';
import CommonInput from "@/pages/OrderModule/common/components/CommonInput";
import { addQuickSearchOp } from '@/pages/OrderModule/common/hooks/useConfig/services';


export default ({ items = [], page, searchForm, stageParams, originFormData, handleOk, handleCancel }) => {
  const [form] = Form.useForm();

  const [visible, setVisible] = useState(false);
  const [loading, setLoading] = useState(false);

  useEffect(()=>{
    setVisible(true);
  }, [])

  const handleSave = () => {
    form.validateFields().then(async ({ name })=>{
      if(items.some(item=>item.name == name)){
        return message.info('快捷名称不可重复');
      }
      setLoading(true);
      searchForm.originFormData = originFormData?.current;
      searchForm.stageParams = stageParams?.current;
      const { data, success} = await addQuickSearchOp({
        name,
        page,
        param: JSON.stringify(searchForm),
      });
      setLoading(false);
      if(success){
        message.success('保存成功！');
        handleOk();
        setVisible(false);
      }
    })
  }

  return (<>
  <CommonModal
    title='另存为快捷查询条件'
    visible={visible}
    onOk={handleSave}
    onCancel={()=>setVisible(false)}
    afterClose={handleCancel}
    minHeight={80}
  >
    <CommonForm
          formProps={{
            // onValuesChange(_, values) {
            //   onChange(values);
            // },
            initialValues: {
              input: '',
            },
            form
          }}
          columns={[
            {
              name: 'name',
              Component: CommonInput,
              props: {
                placeholder: '必填，请输入快捷查询名称',
                maxLength: 10,
                'aria-required': true,
                showCount: true,
              },
              rules: [{ required: true, message: '请输入快捷查询名称' }]
            },
          ]}
        />
        <CommonLoading loading={loading} />
    {/* <Form form={form}>
       <Form.Item name='name' rules={[{required:'true', message:'请输入快捷查询名称'}]}>
           <Input placeholder='必填，请输入快捷查询名称' showCount maxLength={10} size='large' />
       </Form.Item>
    </Form> */}
  </CommonModal>
  </>)
}